<template>
    <div class="item-wrapper flex space-x-2 w-screen overflow-scroll px-4">
        <div
            class="item flex-[0_0_auto] w-28y space-y-2"
            v-for="(item, index) in items"
            :key="item.title"
        >
            <div class="item-image">
                <img :src="item.cover" class="rounded-lg" :alt="item.name" />
            </div>
            <div class="item-info">
                <div class="item-name text-xs font-bold">{{ item.title }}</div>
                <div class="item-price text-xs font-bold">{{ getCurrency(item.price) }}</div>
            </div>
        </div>
    </div>
</template>
<script lang="ts" setup>
import type { RecentlyViewItem } from '../types/home';
// 工具函数库
import { getCurrency } from '../utils/utils'
// ts 里比js复杂
// 数据 
interface Props {
    items: RecentlyViewItem[]
}
defineProps<Props>()
</script>